Skip to content

feat(nextjs): Add browser SDK to app directory browser bundle #6812

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Jan 17, 2023

Conversation

lforst
Copy link
Member

@lforst lforst commented Jan 17, 2023

Ref: #6726

This PR injects the Next.js SDK into the browser code when the app directory is used.

Note: Pageload transactions seem to work fine. Navigation transactions don't fire yet.

@lforst lforst requested review from Lms24 and AbhiPrasad January 17, 2023 09:15
@github-actions
Copy link
Contributor

github-actions bot commented Jan 17, 2023

size-limit report 📦

Path Size
@sentry/browser - ES5 CDN Bundle (gzipped + minified) 19.82 KB (0%)
@sentry/browser - ES5 CDN Bundle (minified) 61.47 KB (0%)
@sentry/browser - ES6 CDN Bundle (gzipped + minified) 18.5 KB (+0.01% 🔺)
@sentry/browser - ES6 CDN Bundle (minified) 54.77 KB (0%)
@sentry/browser - Webpack (gzipped + minified) 20.22 KB (0%)
@sentry/browser - Webpack (minified) 66.17 KB (0%)
@sentry/react - Webpack (gzipped + minified) 20.24 KB (0%)
@sentry/nextjs Client - Webpack (gzipped + minified) 47.51 KB (0%)
@sentry/browser + @sentry/tracing - ES5 CDN Bundle (gzipped + minified) 26.73 KB (-0.02% 🔽)
@sentry/browser + @sentry/tracing - ES6 CDN Bundle (gzipped + minified) 25.02 KB (+0.01% 🔺)
@sentry/replay ES6 CDN Bundle (gzipped + minified) 43.12 KB (-0.83% 🔽)
@sentry/replay - Webpack (gzipped + minified) 38.45 KB (-1% 🔽)
@sentry/browser + @sentry/tracing + @sentry/replay - ES6 CDN Bundle (gzipped + minified) 60.35 KB (-0.6% 🔽)

@lforst lforst force-pushed the lforst-app-dir-browser branch from e453015 to 4c3e556 Compare January 17, 2023 09:50
@lforst lforst force-pushed the lforst-app-dir-browser branch from ec7441d to 674f58e Compare January 17, 2023 15:31
@lforst lforst marked this pull request as ready for review January 17, 2023 15:31
{
"typescript.tsdk": "node_modules/typescript/lib",
"typescript.enablePromptUseWorkspaceTsdk": true
}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we remove?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah yeah. Next.js 13 seems to auto-generate this - I gitignored it.

@@ -0,0 +1,5 @@
'use client';
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lol @ the fact that the nextjs api uses directives like this

@@ -9,4 +9,4 @@ const handler = async (_req: NextApiRequest, res: NextApiResponse): Promise<void
res.status(200).json({});
};

export default withSentry(handler);
export default wrapApiHandlerWithSentry(handler, '/api/http');
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

shouldn't we be autowrapping these anyway?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actually yes. I removed the wrappers and everything still seems to pass 👍

@lforst lforst merged commit d34fd36 into master Jan 17, 2023
@lforst lforst deleted the lforst-app-dir-browser branch January 17, 2023 17:19
@switz
Copy link

switz commented Jan 20, 2023

Sorry to bother, but can this get a publish to npm (even as a canary/beta release?). It's blocking me from tracking errors in my app directory client routes.

@AbhiPrasad
Copy link
Member

Hey @switz - our app directory support is tracked by #6726. Please subscribe to that issue to see when the feature will be finished. There's some more work other than this PR to fully polish our support and make sure we handle all of the edge cases - so just releasing this PR is not enough. Thanks!

@lforst
Copy link
Member Author

lforst commented Jan 21, 2023

@switz We're probably gonna release this change as part of a release on Monday. This will add client-side monitoring to the app directory. Server-side monitoring still needs some work.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants